/**
 * Created by chesw on 2017/5/11.
 * describe：我的预约
 */
var patientAppoint = Vue.extend({
    props: [],
    data: function () {
        return {
            remotely: 'remotely',
            lineDown: 'line-down',
            cancelBtn: '',//'cancel-btn',
            viewBtn: 'view-medical-records',
            tab: true,
            pageInfo: {
                allRecord: [],
                curPageRecord: [],
                totalCount: 0,
                pageSize: 10,
                pageCount: 10,
                pageCurrent: 1
            },
            unfinished: [],
            already: []
        }
    },
    computed: {
      firstTab: function () {
          return this.tab ? 'active-tab' : 'inactive-tab'
      },
      secondTab: function () {
          return this.tab ? 'inactive-tab' : 'active-tab'
      },
      list: function () {
          return this.tab ? this.pageInfoUnfinish.curPageRecord : this.pageInfoAlready.curPageRecord;
      }
    },
    created: function () {
        var _self = this;
        _self.getUserReservision(true);
    },
    methods: {
        getUserReservision:function(p_param){
            var _self = this;         
            _self.pageInfo.allRecord = [];
            _self.pageInfo.curPageRecord = [];
            _self.showLoad = true;
            _self.$http.post("/PersonalCenter/GetUserReservision").then(function (res) {
                if (res.body.length > 0) {
                    if (p_param) {
                        for (var i = 0; i < res.body.length; i++) {
                            if (res.body[i].Status != 7) {
                                res.body[i].btn.ActionnName = "--";
                                res.body[i].btn.ButtonClass = true;
                                _self.pageInfo.allRecord.push(res.body[i]);
                            }                          
                        }
                    }
                    else {
                        for (var i = 0; i < res.body.length; i++) {
                            if (res.body[i].Status === 7) {
                                res.body[i].btn.ActionnName = "查看病历";
                                res.body[i].btn.ButtonClass = false;
                                _self.pageInfo.allRecord.push(res.body[i]);
                            }
                        }
                    }                 
                    _self.pageInfo.totalCount = _self.pageInfo.allRecord.length;
                    _self.pageInfo = showPageRecords(1, _self.pageInfo);
                    _self.showPage();
                    _self.showLoad = false;
                    _self.ShowPageBox(true, _self.pageInfo);                
                }
                else {
                    var loading = document.getElementById("loading");
                    loading.style.display = "none";
                    _self.ShowPageBox(false);
                }
            });
        },
        ShowPageBox:function(p_show,p_pageObject) {
            var resultEmpty = document.getElementById("result-empty");
            var pageBox = document.getElementById("clinic-page-box");
            if (p_show) {

                resultEmpty.style.display = "none";

                if (p_pageObject.pageCount<=1)
                    pageBox.style.display = "none";
                else
                    pageBox.style.display = "block";
            }
            else {                
                pageBox.style.display = "none";
                resultEmpty.style.display = "block";
                
            }
        },
        showPage: function (p_type) {
            var _self = this;
            var pageBox = document.getElementById("clinic-page-box");

            if (_self.pageInfo.pageCount === 1)
                pageBox.style.display = "none";
            else
                pageBox.style.display = "block";

            var param = {
                pageCount: _self.pageInfo.pageCount,
                curPage: _self.pageInfo.pageCurrent,
                pageInfo: _self.pageInfo,
                page_func: function (p_curPage, p_pageInfo) {
                    showPageRecords(p_curPage, p_pageInfo);
                }
            };
            _self.$emit('show', param);
        },
        btn: function (p_type,p_index) {
            var _this = this;
            var param = {
                text: '该操作不可撤销，是否确认取消该订单',
                l_val: '是',
                r_val: '否',
                type: p_type,
                visitRecord: _this.pageInfo.allRecord[p_index],
                left_func: function () {
                    console.log(_this.$parent);
                    _this.$parent.confirm.type = false;
                    _this.pageInfo.allRecord.splice(p_index, 1);
                }
            };
            if (!p_type)
            {
                _this.$http.post("/PersonalCenter/GetCasesList", _this.pageInfo.allRecord[p_index]).then(function (res) {
                    if (res.body.length == 1) {
                        window.open("/CaseDetail/Index?caseId=" + res.body[0].caseId + "&orgId=" + res.body[0].OrgId + "&visitID=" + res.body[0].visitId);
                    }
                    else {
                        window.open("/CaseDetail/Index");
                    }
                });
            }
            //this.$emit('clickbtn', param);
        },
        tabChange:function(p_param) {
            var _self = this;
            var pageBox = document.getElementById("clinic-page-box");
            pageBox.style.display = "none";
            _self.tab = p_param;
            _self.getUserReservision(p_param);
        }
    },
    template: '<div class="patient-appoint">' +
    '<div class="visit-tab">' +
        '<div class="visit-tab-btn" :class="firstTab" @click="tabChange(true)">未就诊</div>' +
        '<div class="visit-tab-btn" :class="secondTab" @click="tabChange(false)">已就诊</div>' +
    '</div>' +
    '<div class="table table-title flex">' +
        '<div class="first-column">就诊时间</div>' +
        '<div class="second-column">预约专家</div>' +
        '<div class="third-column">就诊地点</div>' +
        '<div class="fourth-column">就诊人</div>' +
        '<div class="fifth-column">就诊费用</div>' +
        '<div class="sixth-column">操作</div>' +
    '</div>' +
    '<div class="table table-row flex" v-for="(item, index) in _self.pageInfo.curPageRecord">' +
        '<div class="first-column date">' +
            '<p>{{item.reservDate.Date}}</p>' +
            '<p>{{item.reservDate.Time}}</p>' +
        '</div>' +
        '<div class="second-column expert">' +
            '<p>{{item.expert.DoctorName}} &nbsp;&nbsp;' +
                '<span class="visit-type" :class="[item.expert.visitType.TypeCls ? remotely : lineDown]">{{item.expert.visitType.TypeName}}</span>' +
            '</p>' +
            '<p v-if="!isEmpty(item.expert.DoctorDepartment)">[{{item.expert.DoctorDepartment}}-{{item.expert.DoctorTitle}}]</p>' +
        '</div>' +
        '<div class="third-column address">' +
            '<p>{{item.addr.HospitalName}}</p>' +
            '<p>{{item.addr.HospitalAddress}}</p>' +
        '</div>' +
        '<div class="fourth-column patient-name">{{item.patient}}</div>' +
        '<div class="fifth-column fee">{{item.Fee}}元</div>' +
        '<div class="sixth-column operate">' +
            '<p :class="[item.btn.ButtonClass ? cancelBtn : viewBtn]" @click="btn(item.btn.ButtonClass,index)">{{item.btn.ActionnName}}</p>' +
        '</div>' +
    '</div>' +
    '<div class="loading" id="loading" :class="[showLoad?\'show\':\'hide\']"><img src="/styles/image/loading.gif"></div>' +
    '<div class="result-empty" id="result-empty">暂无就诊数据</div>'+
    '</div>'
});
